import React from 'react';
import { connect } from 'dva';
import { message, Spin } from 'antd';
import TableCop from '../components/TableCop';
class MaterialPage extends React.Component {
  init() {
    this.props.dispatch({
      type: 'material/getMaterial',
      payload: {
        success: () => {
          message.success('物资数据获取成功！');
          this.setState({ loading: false });
        },
        failed: () => {
          message.error('物资数据获取失败！');
          this.setState({ loading: true });
        },
      }
    });
  }
  constructor(props) {
    super(props);
    this.state = {
      loading: true
    }
    this.init();
  }
  render() {
    const { material: { data } } = this.props;
    const c_columns = [
      {
        title: '商品编码',
        dataIndex: 'product_id',
      }, {
        title: '商品名称',
        dataIndex: 'product_name',
      }, {
        title: '商品类别',
        dataIndex: 'type',
      }, {
        title: '商品单位',
        dataIndex: 'unit',
      }, {
        title: '入库量',
        dataIndex: 'amount_storage',
      }, {
        title: '出库量',
        dataIndex: 'amount_out',
      }, {
        title: '库存量',
        dataIndex: 'amount_stock',
      }, {
        title: '销售均价',
        dataIndex: 'average_selling_price',
      }, {
        title: '库存资金',
        dataIndex: 'inventory_funds',
      }
    ];
    const z_columns = [
      {
        title: '商品编码',
        dataIndex: 'product_id',
      }, {
        title: '商品名称',
        dataIndex: 'product_name',
      }, {
        title: '商品类别',
        dataIndex: 'type',
      }, {
        title: '购买金额',
        dataIndex: 'purchasing_price',
      }, {
        title: '销售金额',
        dataIndex: 'sales_amount',
      }, {
        title: '利润率',
        dataIndex: 'profit_amount',
      }
    ];
    return (
      <div>
        {
          this.state.loading ?
            <Spin size="large" tip="loading ..." />
            :
            <div>
              <p style={{ textAlign: 'center' }}>仓库明细表</p>
              <TableCop rowKey="product_id" columns={c_columns} dataSource={data ? data.material_warehouse : []} />
              <p style={{ textAlign: 'center' }}>资金明细表</p>
              <TableCop rowKey="product_id" columns={z_columns} dataSource={data ? data.material_funds : []} />
            </div>
        }
      </div>
    );
  }
}

export default connect(({ material }) => ({ material }))(MaterialPage);